<template>
  <div class="left-container">
    <div class="video-container">
      <video
        :src="video"
        width="640"
        :poster="poster"
        controls="controls"
      >
        your browser does not support the video tag
      </video>
    </div>
    <div class="video-descri">
      实施乡村振兴战略的总目标就是农业农村现代化，实现农业大国向农业强国跨进。乡村振兴战略必须坚持农业和农村优先发展总方针。
    </div>
    <div class="video-xjp" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      poster: 'https://api.zesi.com.cn/storage/datav/video.jpg',
      video: 'https://pulavalley.intelirri.com/media/video.mp4'
    }
  },
  methods: {}
}
</script>

<style lang="scss">
.video-container{
  display:flex;
  align-items:center;
  justify-content:center;
  width:900px;
  height:564px;
  text-align:center;
  background:url('https://api.zesi.com.cn/storage/datav/video_container.png') no-repeat center;
  background-size:contain;
}
.video-descri{
  font-size:18px;
  line-height:36px;
}
.video-xjp{
  width:100%;
  height:100px;
  background:url('https://api.zesi.com.cn/storage/datav/xjp.png') no-repeat bottom right;
  background-size:contain;
}
</style>
